<template>
  <div class="submenuList ys-MenuList">
    <div v-if="parent.tabs" >
      <YsSubmenu :name="`${parent.frame}`">
        <template slot="title">
          <!-- <span v-if="parent.rsim_url != ''" class="iconfont proIconfont" :class="parent.rsim_url"></span> -->
          <span v-if="parent.rsim_url != ''" class="wrapper-icon" :class="parent.rsim_url"></span>
          <!-- <span class="wrapper-icon"><YsIcon type="logo-angular" class="menu-icon"/></span> -->
          <span class="menuName">{{parent.name}}</span>
        </template>
        <div style="overflow: hidden;">
          <template v-for="item in parent.tabs">
            <re-submenu v-if="item.tabs" :key="`menu_${item.rs_code}`" :name="item.frame" :parent="item"></re-submenu>
            <YsMenuItem v-else :key="`menu_${item.rs_code}`" :name="`${item.frame}`">
              <span class="menuName" :title="item.name">{{item.name}}</span>
            </YsMenuItem>
          </template>
        </div>
      </YsSubmenu>
    </div>
  </div>

</template>

<script>
/**
 * 开发者：齐广广
 */
export default {
  name: 'ReSubmenu',
  props: {
    /**
     * 递归组件的数据
     */
    parent: {
      type: Object,
      default: () => ({})
    },
  }
}
</script>
<style lang="less" scoped>
.menuName {
  width: 124px;
  font-size: 16px;
}
.submenuList {
  .ivu-menu {
    li {
      border-radius: 4px;
      padding: 0 !important;
          overflow: hidden !important;
      padding-left: 30px !important;
      margin: 10px 24px !important;
      height: 40px !important;
      line-height: 40px !important;
    }
  }
}
</style>